<template>
	<div>
		<van-pull-refresh v-model="loading" @refresh="onRefresh">
			<van-list v-if="list.length>0" v-model:loading="loading" :finished="finished" finished-text="" @load="onLoad">
				<van-cell v-for="item in list" :key="item.orderNo" :title="item.bazi" :label="item.createDate" is-link value="查看结果"
					@click="getDetail(item)" />
			</van-list>
			<van-empty v-else description="没有测算数据" />
		</van-pull-refresh>
		<van-popup v-model:show="show" position="bottom" closeable title="八字分析">
			<div class="content">
				<div v-html="htmlContent"></div>
				<div >
					<van-button type="primary" block round @click="show=false">关闭</van-button>
				</div>
			</div>
		</van-popup>
	</div>
</template>

<script setup>
	import {
		ref,onMounted
	} from 'vue'
	import {getTestList,testBazi} from '@/api/bazi'
	 const pagetion = ref({
	    current: 1,
	    pageSize: 15
	  })
	  const list = ref([]);
	  const loading = ref(false);
	  const refreshing=ref(false);
	  const finished = ref(false);
	  const onLoad = () => {
	    // 异步更新数据
	    fetchData()
	  };
	  const fetchData = () => {
	    getTestList(pagetion.value)
	      .then(res => {
			  var ret=res.result
	        list.value = ret.items
	        pagetion.value.current++;
	         // 数据全部加载完成
	            if (pagetion.value.current >= ret.totalPages) {
	              finished.value = true;
	            }
	      })
	      .finally(()=>{
	        // 加载状态结束
	        loading.value = false;
	      })
	  }
	const onRefresh = () => {
		pagetion.value.current=1
	    finished.value = false
	    loading.value = true
	    fetchData()
	  }
	 
	const htmlContent = ref('');
	const show = ref(false);
	const showPopup = () => {
		show.value = true;
	};
	const getDetail = (item) => {
		testBazi({orderNo:item.orderNo})
					.then(res=>{
						if(res.success)
						{
							let ret=res.result
							console.log('ret='+JSON.stringify(ret))
							show.value = true
							htmlContent.value=ret.doc
						}else
						{
							showNotify({type:'danger',message:res.msg})
						}
					})
	}
	 
	onMounted(()=>{
		onRefresh()
	})
</script>

<style scoped>
	.content{
		margin-left:15px;margin-right:15px
	}
</style>